<nz-card>
    <div nz-row class="outer-panel">
        <div nz-col [nzSpan]="8" class="inner-panel">
            <base-grid
                [name]="'命令'"
                [keyField]="'templateId'"
                [nameField]="'templateName'"
                [usePage]="false"
                [showSort]="true"
                [columns]="columns"
                [schema]="schema"
                [clickRowWhileSetRowClass]="true"
                [showOperateModify]="true"
                [showOperateDelete]="true"
                [showModify]="false"
                [showDelete]="false"
                [popupWidth]="400"
                [popupHeight]="'80%'"
                [beforeDataRender]="beforeDataRender.bind(this)"
                (itemClick)="itemClick($event)"
            >
            </base-grid>
        </div>
        <div nz-col [nzSpan]="16" class="inner-panel" style="padding: 5px;" >
            <div style="height: 40%; padding: 5px; position: relative;" *ngIf="!selectTemplate">
                <div class="h3" style="padding: 10px;">
                    请选择左侧模板！
                </div>
            </div>
            <div style="height: 40%; padding: 5px; position: relative;" *ngIf="selectTemplate?.templateId">
                <div class="h4" style="padding: 5px 0;">
                    模板参数及命令
                </div>
                <div style="height: calc(100% - 45px)">
                    <textarea #textAreaElement style="width: 100%; height: 100%;"></textarea>
                </div>
                <div style="text-align: right; position: absolute; right: 5px ; bottom: -25px; z-index: 1">
                    <button nz-button [nzType]="'primary'" (click)="saveCommand()">
                        保存
                    </button>
                </div>
            </div>
            <div style="height: 60%">
                <sys-backup-template-param [templateId]="selectTemplate?.templateId"></sys-backup-template-param>
            </div>
        </div>
    </div>
</nz-card>
